<template>
  <el-card>
    <h2>{{ isEdit ? '编辑软件' : '添加软件' }}</h2>

    <el-form :model="form" label-width="100px">
      <el-form-item label="软件名称">
        <el-input v-model="form.name" />
      </el-form-item>

      <el-form-item label="版本号">
        <el-input v-model="form.version" />
      </el-form-item>

      <el-form-item label="分类">
        <el-select v-model="form.category" placeholder="选择分类">
          <el-option v-for="c in categories" :key="c" :label="c" :value="c" />
        </el-select>
      </el-form-item>

      <el-form-item label="开源协议">
        <el-select v-model="form.license" placeholder="选择协议">
          <el-option v-for="l in licenses" :key="l" :label="l" :value="l" />
        </el-select>
      </el-form-item>

      <el-form-item label="来源说明">
        <el-input v-model="form.source_info" />
      </el-form-item>

      <el-form-item label="详细描述">
        <el-input v-model="form.description" type="textarea" rows="4" />
      </el-form-item>

      <!-- 下载链接管理 -->
      <el-form-item label="下载链接">
        <div v-for="(link, i) in form.links" :key="i" class="link-block">
          <el-input v-model="link.url" placeholder="URL地址" style="width: 60%" />
          <el-select v-model="link.link_type" style="width: 100px">
            <el-option label="Magnet" value="magnet" />
            <el-option label="ED2K" value="ed2k" />
          </el-select>
          <el-select v-model="link.file_format" style="width: 100px">
            <el-option v-for="fmt in formats" :key="fmt" :label="fmt" :value="fmt" />
          </el-select>
          <el-input v-model="link.note" placeholder="备注" style="width: 180px" />
          <el-button type="danger" size="small" @click="removeLink(i)">删除</el-button>
        </div>
        <el-button type="primary" size="small" @click="addLink">添加链接</el-button>
      </el-form-item>

      <el-form-item>
        <el-button type="success" @click="submit">保存</el-button>
      </el-form-item>
    </el-form>
  </el-card>
</template>

<script setup lang="ts">
import { ref, onMounted } from 'vue'
import { getCategoryList, getLicenseList } from '@/api'
import { createSoftware, updateSoftware } from '@/api/admin'
import type { SoftwareDetail } from '@/types/api'

const isEdit = false // 可传参判断
const form = ref<Partial<SoftwareDetail>>({
  name: '',
  version: '',
  category: '',
  license: '',
  description: '',
  source_info: '',
  links: []
})

const formats = ['zip', 'tar.gz', 'rpm', 'deb', 'src']
const categories = ref<string[]>([])
const licenses = ref<string[]>([])

function addLink() {
  form.value.links?.push({
    url: '',
    link_type: 'magnet',
    file_format: 'zip',
    note: ''
  })
}
function removeLink(index: number) {
  form.value.links?.splice(index, 1)
}

async function submit() {
  try {
    if (isEdit && form.value.id) {
      await updateSoftware(form.value.id, form.value)
    } else {
      await createSoftware(form.value)
    }
    alert('保存成功！')
  } catch (err: any) {
    alert(err.message)
  }
}

onMounted(async () => {
  categories.value = await getCategoryList()
  licenses.value = await getLicenseList()
})
</script>

<style scoped>
.link-block {
  display: flex;
  gap: 8px;
  margin-bottom: 10px;
  align-items: center;
}
</style>
